import L from 'leaflet';

/**
 * 安全除法
 * @param  {number} dividend 被除数
 * @param  {number} divisor 除数
 * @param  {number} reserve 处理精度 
 * @return {number} 商
 */
function divide(dividend, divisor, reserve = 8) {
    const result = Number((dividend / divisor).toFixed(reserve))
    if (Number.isNaN(result)) {
        throw new Error('result is NaN')
    } else {
        return result
    }
}

/**
 * 根据手绘地图的长宽获取相对经纬度范围
 * @param  {number} length 长度
 * @param  {number} reserve 精度
 * @return {number} 经纬度(虚拟的)
 */
function getRelativeLength(length, reserve = 10000) {
    return divide(length, reserve)
}


// 图片的地理范围约束  PS:实际照片长宽/10000
const image = {
    url: require('@/assets/hand-painted-map/hand-painted-map.png'), // 手绘地图url地址
    width: 2524,
    height: 1624
}
// 图片的地理范围约束  PS:实际照片长宽/10000
const imageBounds = L.latLngBounds([[0, 0], [getRelativeLength(image.height), getRelativeLength(image.width)]])


/**
 * 地图基础配置信息
 */
export const mapBasicInfo = {
    url: image.url,
    zoom: 13,
    minZoom: 12,
    maxZoom: 16,
    center: L.latLng(0, 0),
    maxBounds: imageBounds, // 地图最大边界范围
}

/**
 * 地图icon图标库 
 */
export const icons = {
    lingxiuguangchang: L.icon({         // 领秀广场
        iconUrl: require('@/assets/hand-painted-map/lingxiuguangchang.png'), // 图标路径
        iconSize: [76, 34], // 图标大小
        iconAnchor: [0, 34], // 中心点偏移量
        popupAnchor: [0, 0], // popup偏移量
        tooltipAnchor: [0, 0],// tooltip偏移量
    }),
    xingguangguangchang: L.icon({       // 星光广场
        iconUrl: require('@/assets/hand-painted-map/xingguangguangchang.png'),
        iconSize: [76, 34],
        iconAnchor: [0, 34],
        popupAnchor: [0, 0],
    }),
    yuehuanguangchang: L.icon({     // 月环广场
        iconUrl: require('@/assets/hand-painted-map/yuehuanguangchang.png'),
        iconSize: [76, 34],
        iconAnchor: [0, 34],
        popupAnchor: [0, 0],
    }),
    youeryuan: L.icon({     // 幼儿园
        iconUrl: require('@/assets/hand-painted-map/youeryuan.png'),
        iconSize: [120, 34],
        iconAnchor: [0, 34],
        popupAnchor: [0, 0],
    }),
    fuzhizunyuyangguan: L.icon({       // 福至尊鱼羊馆
        iconUrl: require('@/assets/hand-painted-map/fuzhizunyuyangguan.png'),
        iconSize: [104, 34],
        iconAnchor: [0, 34],
        popupAnchor: [0, 0],
    }),
    tianmeiqu: L.icon({       // 田美渠
        iconUrl: require('@/assets/hand-painted-map/tianmeiqu.png'),
        iconSize: [56.5, 34],
        iconAnchor: [0, 34],
        popupAnchor: [0, 0],
    }),
    jinpenshequ: L.icon({       // 金盆社区
        iconUrl: require('@/assets/hand-painted-map/jinpenshequ.png'),
        iconSize: [76, 34],
        iconAnchor: [0, 34],
        popupAnchor: [0, 0],
    }),
    xiuqipingtai: L.icon({       // 休憩平台
        iconUrl: require('@/assets/hand-painted-map/xiuqipingtai.png'),
        iconSize: [76, 34],
        iconAnchor: [0, 34],
        popupAnchor: [0, 0],
    }),
    qidian: L.icon({        // 路线导航-起点
        iconUrl: require('@/assets/hand-painted-map/luxian-qidian.png'),
        iconSize: [30, 30],
        iconAnchor: [15, 30],
        popupAnchor: [0, 0],
    }),
    zhongdian: L.icon({     // 路线导航-终点
        iconUrl: require('@/assets/hand-painted-map/luxian-zhongdian.png'),
        iconSize: [30, 30],
        iconAnchor: [15, 30],
        popupAnchor: [0, 0],
    }),
    cesuo: L.icon({     // 公共厕所
        iconUrl: require('@/assets/hand-painted-map/dibiao-cesuo.png'),
        iconSize: [30, 30],
        iconAnchor: [15, 30],
        popupAnchor: [0, 0],
        tooltipAnchor: [12, -15]
    }),
    gongjiao: L.icon({      // 公交站台
        iconUrl: require('@/assets/hand-painted-map/dibiao-gongjiao.png'),
        iconSize: [30, 30],
        iconAnchor: [15, 30],
        popupAnchor: [0, 0],
        tooltipAnchor: [12, -15]
    }),
    jianzhu: L.icon({     // 重点建筑
        iconUrl: require('@/assets/hand-painted-map/dibiao-jianzhu.png'),
        iconSize: [30, 30],
        iconAnchor: [15, 30],
        popupAnchor: [0, 0],
        tooltipAnchor: [12, -15]
    }),
    tingchechang: L.icon({      // 停车场
        iconUrl: require('@/assets/hand-painted-map/dibiao-tingchechang.png'),
        iconSize: [30, 30],
        iconAnchor: [15, 30],
        popupAnchor: [0, 0],
        tooltipAnchor: [12, -15]
    }),
    chongdianzhuang: L.icon({      // 充电桩
        iconUrl: require('@/assets/hand-painted-map/dibiao-chongdianzhuang.png'),
        iconSize: [30, 30],
        iconAnchor: [15, 30],
        popupAnchor: [0, 0],
        tooltipAnchor: [12, -15]
    }),
}

/**
 * 地图上的makers点位
 * 
 *  LatLng: Object or Array, 必需。标记点的经纬度坐标。
    icon: Object, 可选。设置标记点的图标，可以是LIcon或LDivIcon对象。
    draggable: Boolean, 可选。设置标记点是否可拖拽。
    clickable: Boolean, 可选。设置标记点是否可以被点击。
    keyboard: Boolean, 可选。设置标记点是否可以通过键盘进行交互。
    title: String, 可选。设置标记点的标题。
    alt: String, 可选。设置标记点的替代文本。
    zIndexOffset: Number, 可选。设置标记点的堆叠顺序偏移量。
    opacity: Number, 可选。设置标记点的不透明度。
    riseOnHover: Boolean, 可选。设置标记点是否在悬停时上升。
    riseOffset: Number, 可选。设置标记点上升的像素数。
    pane: String, 可选。设置标记点的容器pane。
    bubblingMouseEvents: Boolean, 可选。设置标记点是否响应冒泡鼠标事件。
 */
export const markers = {
    lingxiuguangchangMarker: {
        name: '领秀广场',
        LatLng: [0.12490792796516653, 0.20335435867309573],
        realLatLng: [26.478935, 116.018588],
        icon: icons.lingxiuguangchang,
        hiddenToolTip: true,
        tooltip: {
            opacity: 0
        }
    },
    xingguangguangchangMarker: {
        name: '星光广场',
        LatLng: [0.08044585161502812, 0.12945413589477542],
        realLatLng: [26.478623, 116.016306],
        icon: icons.xingguangguangchang,
        tooltip: {
            opacity: 0
        }
    },
    yuehuanguangchangMarker: {
        name: '月环广场',
        LatLng: [0.03401297944683676, 0.050382614135742194],
        realLatLng: [26.478114, 116.013252],
        icon: icons.yuehuanguangchang,
        tooltip: {
            opacity: 0
        }
    },
    youeryuanMarker: {
        name: '幼儿园',
        LatLng: [0.06806453570123158, 0.07623910903930665],
        realLatLng: [26.478373, 116.01455],
        icon: icons.youeryuan,
        tooltip: {
            opacity: 0
        }
    },
    fuzhizunyuyangguanMarker: {
        name: '福至尊鱼羊馆',
        LatLng: [0.11636745750424568, 0.15840053558349612],
        realLatLng: [26.478898, 116.017699],
        icon: icons.fuzhizunyuyangguan,
        tooltip: {
            opacity: 0
        }
    },
    tianmeiquMarker: {
        name: '田美渠',
        LatLng: [0.06437300281441957, 0.1002931594848633],
        realLatLng: [26.478417, 116.014855],
        icon: icons.tianmeiqu,
        tooltip: {
            opacity: 0
        }
    },
    jinpenshequMarker: {
        name: '金盆社区',
        LatLng: [0.06952284060573127, 0.12359619140625001],
        realLatLng: [26.478021, 116.015327],
        icon: icons.jinpenshequ,
        tooltip: {
            opacity: 0
        }
    },
    xiuqipingtaiMarker: {
        name: '休憩平台',
        LatLng: [0.0908946609708948, 0.16857147216796875],
        realLatLng: [26.478304, 116.017258],
        icon: icons.xiuqipingtai,
        tooltip: {
            opacity: 0
        }
    },
    gongjiao1: {
        name: '公交站台',
        LatLng: [0.047979349250941807, 0.1378440856933594],
        realLatLng: [26.477876, 116.015668],
        icon: icons.gongjiao,
        tooltip: {
            direction: 'right',
            className: 'l-map-marker-tooltip gongjiao',
        }
    },
    chongdianzhuang1: {
        name: '充电桩1',
        LatLng: [0.05583285401766239, 0.1075887680053711],
        realLatLng: [26.478045, 116.014689],
        icon: icons.chongdianzhuang,
        tooltip: {
            direction: 'right',
            className: 'l-map-marker-tooltip chongdianzhuang',
        }
    },
    chongdianzhuang2: {
        name: '充电桩2',
        LatLng: [0.06542442807376109, 0.019376277923583988],
        realLatLng: [26.478866, 116.013405],
        icon: icons.chongdianzhuang,
        tooltip: {
            direction: 'right',
            className: 'l-map-marker-tooltip chongdianzhuang',
        }
    },
    chongdianzhuang3: {
        name: '充电桩3',
        LatLng: [0.041756626247445416, 0.07703304290771486],
        realLatLng: [26.477928, 116.013849],
        icon: icons.chongdianzhuang,
        tooltip: {
            direction: 'right',
            className: 'l-map-marker-tooltip chongdianzhuang',
        }
    },
    chongdianzhuang4: {
        name: '充电桩4',
        LatLng: [0.08123065119116593, 0.08467197418212892],
        realLatLng: [26.478785, 116.014896],
        icon: icons.chongdianzhuang,
        tooltip: {
            direction: 'right',
            className: 'l-map-marker-tooltip chongdianzhuang',
        }
    },
    chongdianzhuang5: {
        name: '充电桩5',
        LatLng: [0.10535295489913918, 0.13147115707397464],
        realLatLng: [26.479011, 116.016778],
        icon: icons.chongdianzhuang,
        tooltip: {
            direction: 'right',
            className: 'l-map-marker-tooltip chongdianzhuang',
        }
    },
    chongdianzhuang6: {
        name: '充电桩6',
        LatLng: [0.0878795662679575, 0.16011714935302737],
        realLatLng: [26.478292, 116.016886],
        icon: icons.chongdianzhuang,
        tooltip: {
            direction: 'right',
            className: 'l-map-marker-tooltip chongdianzhuang',
        }
    },
    chongdianzhuang7: {
        name: '充电桩7',
        LatLng: [0.10027697181278707, 0.18552303314208984],
        realLatLng: [26.478518, 116.017856],
        icon: icons.chongdianzhuang,
        tooltip: {
            direction: 'right',
            className: 'l-map-marker-tooltip chongdianzhuang',
        }
    },
    chongdianzhuang8: {
        name: '充电桩8',
        LatLng: [0.1136380877486556, 0.16968727111816406],
        realLatLng: [26.478939, 116.017937],
        icon: icons.chongdianzhuang,
        tooltip: {
            direction: 'right',
            className: 'l-map-marker-tooltip chongdianzhuang',
        }
    },
    chongdianzhuang9: {
        name: '充电桩9',
        LatLng: [0.13559782447155072, 0.16123294830322268],
        realLatLng: [26.47948, 116.018026],
        icon: icons.chongdianzhuang,
        tooltip: {
            direction: 'right',
            className: 'l-map-marker-tooltip chongdianzhuang',
        }
    },
    tingchechang1: {
        name: '停车场1',
        LatLng: [0.05864064296649501, 0.049953460693359375],
        realLatLng: [26.478567, 116.0138],
        icon: icons.tingchechang,
        tooltip: {
            direction: 'right',
            className: 'l-map-marker-tooltip tingchechang',
        }
    },
    tingchechang2: {
        name: '停车场2',
        LatLng: [0.043683312594588866, 0.08218288421630861],
        realLatLng: [26.477956, 116.014016],
        icon: icons.tingchechang,
        tooltip: {
            direction: 'right',
            className: 'l-map-marker-tooltip tingchechang',
        }
    },
    tingchechang3: {
        name: '停车场3',
        LatLng: [0.06616609112406295, 0.11956214904785158],
        realLatLng: [26.478078, 116.015462],
        icon: icons.tingchechang,
        tooltip: {
            direction: 'right',
            className: 'l-map-marker-tooltip tingchechang',
        }
    },
    tingchechang4: {
        name: '停车场4',
        LatLng: [0.0894961059460438, 0.16470909118652347],
        realLatLng: [26.478369, 116.017231],
        icon: icons.tingchechang,
        tooltip: {
            direction: 'right',
            className: 'l-map-marker-tooltip tingchechang',
        }
    },
    tingchechang5: {
        name: '停车场5',
        LatLng: [0.1098363311090306, 0.20071506500244143],
        realLatLng: [26.478587, 116.018309],
        icon: icons.tingchechang,
        tooltip: {
            direction: 'right',
            className: 'l-map-marker-tooltip tingchechang',
        }
    },
    tingchechang6: {
        name: '停车场6',
        LatLng: [0.12988666834364349, 0.17279782236498067],
        realLatLng: [26.479274, 116.018184],
        icon: icons.tingchechang,
        tooltip: {
            direction: 'right',
            className: 'l-map-marker-tooltip tingchechang',
        }
    },
}


/** 
 *  导航线路
 * 
 *  items:  name: 'atob', // 推荐路线分段名称
            latLngs: [], // 折线或多段线的经纬度坐标数组，可以是一个二维数组，也可以是一个一维数组。对于一条折线，可以使用一维数组；对于多段线，每一段的经纬度坐标可以用一个二维数组表示。默认值为 []。
            color: '#3388ff', // 折线或多段线的颜色，可以是十六进制颜色码、RGB 颜色值或 CSS 颜色名称。默认值为 #3388ff,
            weight: 5, // 折线或多段线的宽度，单位为像素。默认值为 5。  
            opacity: 1, // 折线或多段线的不透明度，取值范围为 0 到 1。默认值为 1。
            lineCap: 'round', // 折线或多段线线端的样式。可以取值为 butt、round 或 square。默认值为 round。
            lineJoin: 'round', // 折线或多段线线段连接处的样式。可以取值为 miter、round 或 bevel。默认值为 round。
            dashArray: null, // 折线或多段线的虚线样式，可以使用数字数组表示虚线和实线的长度，例如 [10, 5] 表示先绘制 10 个像素的实线，再绘制 5 个像素的空白，然后再绘制 10 个像素的实线，以此类推。默认值为 null，表示不使用虚线。
            dashOffset: null, // 虚线样式的偏移量，单位为像素。默认值为 null。
            fill: false, // 是否填充折线或多段线。默认值为 false。
            fillColor: '#3388ff', // 折线或多段线的填充颜色，可以是十六进制颜色码、RGB 颜色值或 CSS 颜色名称。默认值为 #3388ff。
            smoothFactor: 1.0, // 折线或多段线平滑度，取值范围为 0 到 1，表示绘制的曲线平滑程度。默认值为 1.0。
            noClip: false, // 是否剪切折线或多段线，当此属性为 true 时，折线或多段线的部分区域可能不可见。默认值为 false。
            clickable: true, // 是否响应点击事件。默认值为 true。
            draggable: false, // 是否可以被拖拽。默认值为 false。
            smoothFactor: 1.0, // 折线或多段线平滑度，取值范围
 */
export const polylines = [
    {
        name: 'atob',
        latLngs: [[0.03298113888844063, 0.04053354263305665], [0.05731466096560872, 0.08327722549438478], [0.08205411013542034, 0.12668609619140628], [0.10509961909994639, 0.16687631607055664], [0.12390432145098706, 0.19921864039301523]],
        realLatLngs: [[26.478935, 116.018588], [26.478373, 116.01455], [26.478623, 116.016306], [26.478898, 116.017699], [26.478935, 116.018588]],
        color: '#FF2AB1',
    }
]